import React from "react";
import {connect} from "react-redux"
import {Button} from "antd-mobile"

class Counter extends React.Component {

  goDatiPage = () =>{
    this.props.history.push("/dati")
  }

  render() {
    
    return (
      <div>
        <Button type="primary" onClick={this.goDatiPage}>随机答题</Button>
        <Button type="ghost" style={{marginTop:"20px"}} onClick={this.props.onAddClick5}>闯关答题</Button>
        <Button type="ghost" style={{marginTop:"20px"}} onClick={this.props.onAddClick5}>抽奖答题</Button>
      </div>
    );
  }
}



//将state映射到props函数
const mapStateToProps = (state) => {
  return {
    value: state.num,
  };
};

//将修改state数据的方法映射到props
const mapDispatchToProps = (dispatch) => {
  return {
    onAddClick: () =>
      dispatch({
        type: "add",
      }),
    onAddClick5: () => dispatch({ type: "addNum", num: 5 }),
  };
};

//将上面的这两个方法，将数据仓库的state和修改state的方法映射到组件上，形成新的组件
const App = connect(mapStateToProps, mapDispatchToProps)(Counter);

export default App
